<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <div class="box">abc</div>
    <div id="id">def</div>
    <h3>
        <span>
            <input type="text">
        </span>
    </h3>

    <img src="向日葵.jpg" alt="这是一个向日葵"> -->
    <!-- <input type="text">
    <button>隐藏密码</button> -->
          <!-- <div id = "one"  class="light"   style="font-size: 20px; height: 500px;">切换夜间模式和日间模式</div> -->

          <!-- <style>
            .light {
                /* 日间模式 */
                color:black;
                background-color: white;
            }
            .dark {
                /* 夜间模式 */
                color:white;
                background-color: black;
            }
          </style> -->
    
        <!-- <div class="one">
            这是一个div
        </div> -->

        <ul>
            <li>11</li>
            <li>22</li>
        </ul>
          
    <script>

        let ul = document.querySelector('ul')
        for (let i = 3; i < 10; i++) {
            let li = document.createElement('li');
            li.innerHTML = i + '' + i;
            ul.appendChild(li);
        }

        // 删除 44 这个元素
        let toDelete = document.querySelectorAll('li')[3];
        console.log(toDelete);
        ul.removeChild(toDelete)

        // let input =  document.createElement('input');
        // // 让输入框里默认就显示 hello 这个内容
        // input.value = 'hello'
        // let div = document.querySelector('.one');
        // div.appendChild(input);

        // let div = document.querySelector('#one');
        // div.onclick = function() {
        //     // 点击 div 切换夜间模式和日间模式
        //     if (div.className == 'dark') {
        //         div.className = 'light';
        //     } else {
        //         div.className = 'dark';
        //     }
            
            
        //     // // 选获取到当前的字体大小
        //     // let fontSize =  parseInt(div.style.fontSize);
        //     // fontSize += 10;
        //     // // 设置字体大小的时候, 不要忘记px这个单位   
        //     // div.style.fontSize = fontSize + 'px'; 
        // }

        // let input = document.querySelector('input');
        // let button = document.querySelector('button');
        // button.onclick = function() {
        //     if(input.type == 'text') {
        //         input.type = 'password';
        //         button.innerHTML = '显示密码'
        //     } else {
        //         input.type = 'text';
        //         button.innerHTML = '隐藏密码'
        //     }

        //     //console.log(input.value);
        //     // let value = parseInt(input.value);
        //     // value += 1;
        //     // input.value = value;


        // }

        // let img = document.querySelector('img');
        // img.onclick = function() {
        //     console.log(img.src);   
        //     img.src ='美女小姐姐.jpg'; 
        
        // }
        // let div = document.querySelector('.box');
        // div.onclick = function() {
        //     //alert('hello');
        //     console.log(div.innerHTML); 
        //     div.innerHTML += 'a';
        // }
        // let elem1 = document.querySelector('.box');
        // // console.log(elem1);
        // console.dir(elem1);

        // let elem2 = document.querySelector('#id');
        // console.log(elem2);

        // let elem3 = document.querySelector('h3>span>input');
        // console.log(elem3);


    </script>
</body>
</html>